<template>
	<view class="cantainer">
		<fui-card :title="thisGreenLand.name" size="35">
			<view class="fui-card__content">
				<!-- <u-swiper :list="swiperList" class="fui-cover" mode="aspectFill" height="200"></u-swiper> -->
				<my-swiper :list="swiperList"></my-swiper>
			</view>
		</fui-card>
		<fui-card>
			<view class="fui-card__content">
				<view class="text-content">
					<view class="text-title">
						<text>绿地名称： <text v-text="thisGreenLand.name"></text></text>
					</view>
					<view class="text-title">
						<text>网格编号： <text v-text="thisGreenLand.interNum"></text></text>
					</view>
					<view class="text-title">
						<text>上传时间： <text v-text="thisGreenLand.date"></text></text>
					</view>

				</view>
				<view class="split">
					<view class="color"> &nbsp;</view>绿地网格监测信息
				</view>
				<view class="text-content" v-for="(item,index) in observer">
					<u-input clearable border="bottom" class="u-input" v-model="item.value">
						<template slot="prefix">
							<view class="text-box">
								<text class="text" v-if="item.must">*</text>{{item.title}}:
							</view>
						</template>
					</u-input>
				</view>
				<view class="split">
					<view class="color"> &nbsp;</view>管理指标数据
				</view>
				<view class="text-content" v-for="(item,index) in manager">
					<u-input clearable border="bottom" class="u-input" v-model="item.value">
						<template slot="prefix">
							<view class="text-box">
								<text class="text" v-if="item.must">*</text>{{item.title}}:
							</view>
						</template>
					</u-input>
				</view>
			</view>
		</fui-card>
		<button v-text="'消除警报'" class="del-btn" @click="del()"></button>
	</view>
</template>

<script>
	import {
		saveImageToPhotosAlbum
	} from "../../common/utils/saveImage.js"
	export default {
		data() {
			return {
				swiperList: [],
				user: [],
				thisGreenLand: [],
				manager: [{
						title: "P28综防科学性",
						value: "",
						abs: "p28",
						must: true
					},
					{
						title: "P29有害生物预警消警率",
						value: "",
						abs: "p29",
						must: true
					},
					{
						title: "R21应急预案科学性",
						value: "",
						abs: "r21",
						must: true
					},
					{
						title: "R24突发有害生物灾害处置情况",
						value: "",
						abs: "r24",
						must: true
					},
					{
						title: "P11上年度有害生物发生状态",
						value: "",
						abs: "p11",
						must: true
					},
					{
						title: "P12温度适宜性",
						value: "",
						abs: "p12",
						must: true
					},
					{
						title: "P13绿地健康水平",
						value: "",
						abs: "p13",
						must: true
					},
					{
						title: "P14有害生物危害性",
						value: "",
						abs: "p14",
						must: true
					},
					{
						title: "P23有害生物信息上报率",
						value: "",
						abs: "p23",
						must: true
					},
					{
						title: "P24有害生物监测上报及时性",
						value: "",
						abs: "p24",
						must: true
					},
					{
						title: "P25有害生物监测准确性",
						value: "",
						abs: "p25",
						must: true
					},
					{
						title: "P26植保培训参与率",
						value: "",
						abs: "p26",
						must: true
					},
					{
						title: "P27中度以上病虫草害发生情况",
						value: "",
						abs: "p27",
						must: true
					},
				],
				observer: [
					
					{
						title: "P21补植苗木健康情况",
						value: "",
						abs: "p21",
						must: true
					},
					
					{
						title: "P22绿地废弃物收集与清远的规范性",
						value: "",
						abs: "p22",
						must: true
					},
					{
						title: "R11履职水平1",
						value: "",
						abs: "r11",
						must: true
					},
					{
						title: "R12履职水平2",
						value: "",
						abs: "r12",
						must: true
					},
					{
						title: "R22应急培训次数",
						value: "",
						abs: "r22",
						must: true
					},
					{
						title: "R23应急演练次数",
						value: "",
						abs: "r23",
						must: true
					},
					{
						title: "S11绿地城市受损情况",
						value: "",
						abs: "s11",
						must: true
					},
					{
						title: "S21食叶类害虫发生状态",
						value: "",
						abs: "s21",
						must: true
					},
					{
						title: "S25病害发生状态",
						value: "",
						abs: "s25",
						must: false
					},
					{
						title: "S26草害发生状态",
						value: "",
						abs: "s26",
						must: false
					}
				]
			}
		},
		onLoad(options) {
			//page/messageUp/messageUp历史信息页面跳转
			if (options.id != null) {
				this.initDate(options.id)
				this.showPhoto()
			}
		},
		methods: {
			initDate(id) {
				if (this.$storage.get("user") != []) {
					this.thisGreenLand = []
					this.user = JSON.parse(this.$storage.get("user"))
					for (let i = 0; i < this.user.green.length; i++) {
						if (this.user.green[i].interNum == id) {
							this.thisGreenLand = this.changeItem(this.user.green[i]);
							break;
						}
					}
					// console.log(this.thisGreenLand)
				}
			},
			changeItem(item) {
				this.observer.forEach(obitem => {
					for (let grid in item.grid) {
						if (obitem.abs == grid) {
							obitem.value = item.grid[grid]
							break;
						}
					}
				})
				this.manager.forEach(maitem => {
					for (let manager in item.manager) {
						if (maitem.abs == manager) {
							maitem.value = item.manager[manager]
							break;
						}
					}
				})
				return item;
			},
			returnGreen() {
				this.observer.forEach(obitem => {
					for (let grid in this.thisGreenLand.grid) {
						if (obitem.abs == grid) {
							this.thisGreenLand.grid[grid] = obitem.value
							break;
						}
					}
				})
				this.manager.forEach(maitem => {
					for (let manager in this.thisGreenLand.manager) {
						if (maitem.abs == manager) {
							this.thisGreenLand.manager[manager] = maitem.value
							break;
						}
					}
				})
			},
			greenLandDetails(id) {
				if (this.$storage.get("greenLandAll") != []) {
					this.thisGreenLand = []
					let all = this.$storage.get("greenLandAll")
					all.forEach(item => {
						if (item.id == id) {
							// console.log(item)
							this.thisGreenLand = item
							item.greenLandPhotos.forEach(photo => {
								this.swiperList.push(photo.photoUrl)
							})
						}
					})
				}
			},
			showPhoto() {
				this.thisGreenLand.greenLandPhotos.forEach((item, index) => {
					this.swiperList.push(item.photoUrl)
					// console.log(item)
				})
			},
			del() {
				this.returnGreen();
				this.upInsert(this.user)
				return;

			},
			verify(data) {
				if (!data.grid) {
					this.$utils.errorMsg("请填写绿地网格监测信息！")
					return false;
				} else if (!data.manager) {
					this.$utils.errorMsg("请填写绿地网格监测信息！")
					return false;
				} else {
					return true;
				}
			},
			upInsert(user) {
				let data = this.thisGreenLand;
				if (!this.verify(data)) {
					return;
				}
				//每次上传信息，在首页没有更新 2022-11-25
				//保存没有数据，图片没有产生关联，图片的Url地址没有去除Web地址 待修改2022/11/24
				setTimeout(() => {
					this.$http.httpPost('green/save', user).then(response => {
						console.log(response)
						if (response.data.status == 200) {
							// 写入storage缓存
							this.$storage.setJson("user", user)
							//获取用户的绿地信息
							this.$http.httpPost('green/findAllByRole', response.data.data).then(sucess => {
								if (sucess.data.status == 200) {
									this.$storage.set("greenLandAll", sucess.data.data)
								}
							})
							this.$utils.sucessMsg("设置成功");
							setTimeout(()=>{
								this.$utils.switchTab('riskResponse/riskResponse', '');
							},1000)
						}
					})
				}, 800)
			}
		}
	}
</script>

<style scoped lang="scss">
	.cantainer {
		margin: 20rpx;
	}

	.fui-cover {
		border-radius: 20px;
		height: 200rpx;
	}

	.text-content {
		margin-top: 20rpx;
		box-shadow: 5 5 5 #000000;
	
	.text-title {
			margin: 10rpx;
			color: #8b8b8b;
		}
	}

	.split {
		margin: 50rpx 20rpx;
		color: #3b4244;
		font-weight: bold;

		.color {
			display: inline-block;
			width: 8rpx;
			height: 25rpx;
			background-color: #348669;
			margin-right: 5rpx;
		}
	}

	.del-btn {
		color: #e8e8e8;
		width: 40%;
		background-color: #aa0000;
		border-radius: 20rpx;
		margin-top: 2%;
	}
</style>
